<script setup lang="ts">
import { ref, onMounted } from 'vue';
import { useRouter } from 'vue-router'
const router = useRouter()
const formInline = ref({
    date: '2024-10-29',
})

import { FurnaceCoalQualityWeight } from "@/api";

const listTableData = ref<any>([])
const exportAvailable = ref(false)
const relatedReport = ref('')
//list
const getFurnaceCoalQualityWeight = () => {
    FurnaceCoalQualityWeight(formInline.value.date).then(res=>{
        console.log('list-------',res.data)
        const resData = ref<any>(res.data)
        listTableData.value = resData.value.details
        exportAvailable.value = resData.value.exportAvailable
        relatedReport.value = resData.value.relatedReport
    })
}

onMounted(()=>{
    getFurnaceCoalQualityWeight()
    
})

</script>
<template>
    <div class="flex_bg">
        <div class="export_title">
            入炉分煤种煤质
        </div>
        <el-form :inline="true" :model="formInline" class="demo-form-inline mt20">
            <el-form-item label="上煤日期:">
                <el-date-picker v-model="formInline.date" type="date" placeholder="请选择" :clearable="false" format="YYYY/MM/DD" value-format="YYYY-MM-DD" />
            </el-form-item>
            <el-form-item>
                <el-button type="primary" color="#2565C8" @click="getFurnaceCoalQualityWeight">搜索</el-button>
                <el-button v-if="exportAvailable" type="primary" color="#2565C8">下载</el-button>
                <el-button plain color="#2565C8" @click="router.go(-1)">返回</el-button>
            </el-form-item>
        </el-form>
        <div class="table_info small">
            <table>
                <tr>
                    <th rowspan="2">样品名称</th>
                    <th rowspan="2">上煤量</th>
                    <th colspan="5">收到基ar</th>
                    <th colspan="7">空干基</th>
                    <th colspan="6">干基</th>
                    <th>干燥无灰基</th>
                </tr>
                <tr>
                    <th>全水Mar</th>
                    <th>灰分Aar</th>
                    <th>挥发份Var</th>
                    <th>低位发热量Qnet,ar</th>
                    <th>全硫St,a</th>
                    <th>水分Mad</th>
                    <th>挥发份Vad</th>
                    <th>灰分Aad</th>
                    <th>固定碳FCad</th>
                    <th>高位发热量Qgr,ad</th>
                    <th>全硫St,ad</th>
                    <th>氢Had</th>
                    <th>灰分Ad</th>
                    <th>挥发份Vd</th>
                    <th>固定碳FCd</th>
                    <th>高位发热量Qgr,d</th>
                    <th>全硫St,d</th>
                    <th>氢Hd</th>
                    <th>挥发分Vdaf</th>
                </tr>
                <tr v-for="(item,index) in listTableData" :key="index">
                    <td>{{ item.sampleName }}</td>
                    <td>{{ item.amount }}</td>
                    <td>{{ item.qbAd }}</td>
                    <td>{{ item.aar }}</td>
                    <td>{{ item.var }}</td>
                    <td>{{ item.qnetArMj }}</td>
                    <td>{{ item.sta }}</td>
                    <td>{{ item.mad }}</td>
                    <td>{{ item.vad }}</td>
                    <td>{{ item.aad }}</td>
                    <td>{{ item.fCad }}</td>
                    <td>{{ item.qgrad }}</td>
                    <td>{{ item.stad }}</td>
                    <td>{{ item.had }}</td>
                    <td>{{ item.ad }}</td>
                    <td>{{ item.vd }}</td>
                    <td>{{ item.fCd }}</td>
                    <td>{{ item.qgrd }}</td>
                    <td>{{ item.std }}</td>
                    <td>{{ item.hd }}</td>
                    <td>{{ item.vdaf }}</td>
                </tr>
            </table>
        </div>
    </div>
</template>
<style scoped lang="scss">
.export_title{
    text-align: center;
    font-weight: bold;
    font-size: 20px;
    color: #3D4755;
    line-height: 30px;
}
</style>